<template>
	<view class="page">
		<p class="welcome">欢迎使用~</p>
		<p class="register-title">用户注册</p>
		<view class="register-form">
			<view class="form-item">
				<view class="form-title">
					<span class="iconfont icon-shouji"></span>手机号
				</view>
				<input type="text" placeholder="请输入手机号" maxlength="11" v-model="phoneNum" auto-focus/>
			</view>
			<view class="form-item">
				<view class="form-title">
					<span class="iconfont icon-mima"></span>密码
				</view>
				<input type="password" placeholder="请输入密码" maxlength="11" v-model="password"/>
			</view>
			<view class="form-item">
				<view class="form-title">
					<span class="iconfont icon-mima"></span>确认密码
				</view>
				<input type="password" placeholder="请确认密码" maxlength="11" v-model="confirmPassword"/>
			</view>
		</view>
		<view class="register-btn" @click="registerForm">
			注册
		</view>
</view>

</template>

<script>
	import { register } from '../../api/index.js';
	export default {
		data() {
			return {
				phoneNum:'',
				password:'',
				confirmPassword:''
			}
		},
		methods: {
			//提交注册
			registerForm(){
				//组合数据
				let obj = {
					phoneNum:this.phoneNum,
					password:this.password
				}
				console.log(obj);
				//判断输入的是否为空
				if(!this.phoneNum.trim() || !this.password.trim() || !this.confirmPassword.trim()){
					uni.showToast({
						title:"不能为空"
					})
					return
				}
				//判断密码和确认密码是否一致
				if(this.password === this.confirmPassword){
					register(obj).then(res=>{
						if(res.data.status === 0){
							uni.showToast({
								title:"注册成功"
							})
							setTimeout(()=>{
								//跳转登录页面
								uni.navigateTo({
									url:"/pages/login/login"
								})
							},800)
						}
						else{
							uni.showToast({
								title:"注册失败"
							})
						}
					})
					// //提交数据
					// uni.request({
					// 	url:"http://8.140.198.52:8001/api/webapi/reguser",
					// 	method:'POST',
					// 	data:obj,
					// 	success:(res)=>{
					// 		console.log(res,"注册返回的数据");
					// 		uni.showToast({
					// 			title:"注册成功"
					// 		})
					// 		setTimeout(()=>{
					// 			//跳转登录页面
					// 			uni.navigateTo({
					// 				url:"/pages/login/login"
					// 			})
					// 		},800)
					// 	}
					// })
				}else{
					uni.showToast({
						title:'密码不一致'
					})
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
.page{
	background:linear-gradient(#B2D0EC,#FBFCFE);
	width:100%;
	height: 100vh;
	.welcome{
		font-size: 36rpx;
		font-weight: bold;
		width: 100%;
		height: 40rpx;
		line-height: 40rpx;
		// background-color: pink;
		padding-left: 15rpx;
	}
	.register-title{
		font-size: 34rpx;
		font-weight: bold;
		width: 100%;
		height:40rpx;
		line-height: 40rpx;
		padding-left: 15rpx;
		margin: 50rpx 0 50rpx 0;
	}
	.register-form{
		width: 80%;
		height: 500rpx;
		margin: 0 auto;
		background-color: #fff;
		padding: 20rpx;
		border-radius: 10rpx;
		.form-item{
			height: 100rpx;
			// background-color: pink;
			margin: 40rpx 0;
			.form-title{
				margin-bottom: 10rpx;
				.iconfont{
					color: #9294e3;
					font-size: 36rpx;
					
				}
			}
			input{
				padding-left: 5rpx;
				border-bottom: 1px solid #EAEFF3;
			}
		}
	}
	.register-btn{
		width: 85%;
		height: 80rpx;
		line-height: 80rpx;
		text-align: center;
		background-color: #A7C5FB;
		margin: 80rpx auto 0;
		border-radius: 80rpx;
	}
	
}

</style>
